<template>
	<view>
		<cu-custom bgColor="bg-gradual-blue" title="劳动能力鉴定申请"
		:isBack="true" backText="返回"></cu-custom>
		<view>
			<view style="display:flex">
				<view class="personType personTypeLabel" style="width: 320rpx;">申请人</view>
					<checkbox-group @change="checkboxChange" class="personType personTypeCheckbox" style="display:flex">
						<view v-for="personType in personTypes" class="personType" style="width: 190rpx;">
							<checkbox :checked="personType.checked"
							style="transform: scale(0.5)" :value="personType.value"></checkbox>
							<label :for="personType.value" style="width: 122rpx;">{{personType.name}}</label>
						</view>
					</checkbox-group>
			</view>
			<zh-input v-model="formData.aac003" type="text" label="姓名" 
			labelAlign="left" inputAlign="right" :required="true"></zh-input>
			<zh-input v-model="formData.aac002" type="text" label="身份证"
			labelAlign="left" inputAlign="right" :required="true"></zh-input>
			<zh-picker
				pickerRef="sex"
				label="性别"
				labelAlign="left"
				justifyContent="space-between"
				mode="selector"
				:options="sexData"
				rightIconClass="text-gray"
				:value="formData.aac004"
				placeholder="请选择性别"
				themeColor="#FC7983"
				@pickerChange="onSexChange($event)"
				ref="sex"
			></zh-picker>
			<zh-picker
				pickerRef="accidentDate"
				mode="date"
				startYear="2000" 
				label="事故发生时间"
				themeColor="#FC7983"
				labelAlign="left"
				rightIconClass="text-gray"
				justifyContent="space-between"
				:value="formData.accidentDate"
				fields="second"
				ref="accidentDate"
				:required="true"
				@pickerChange="onAccidentDateChange($event)"
			></zh-picker>
			<zh-input v-model="formData.decNum" type="text" label="认定工伤决定书编号"
			labelAlign="left" inputAlign="right" :required="true"></zh-input>
			<zh-picker
				pickerRef="identifyCategory"
				label="鉴定类别"
				labelAlign="left"
				justifyContent="space-between"
				mode="selector"
				:options="identifyCategoryData"
				rightIconClass="text-gray"
				:value="formData.identifyCategory"
				placeholder="请选择鉴定类别"
				themeColor="#FC7983"
				@pickerChange="onSexChange($event)"
				ref="identifyCategory"
			></zh-picker>
			<view class="flex flex-direction" style="padding-top: 10rpx;">
				<button class="cu-btn shadow margin-tb-sm lg bg-gradual-blue-light" @tap="submit">
					提<text style="width: 50rpx;"></text>交
				</button>
			</view>
		</view>
		<u-modal v-model="modelShow"  :content="modelContent" :confirm-color="userType=='20'?'#0081ff':'#f37b1d'"></u-modal>
	</view>
</template>

<script>
	import store from "@/store";
	export default {
		data() {
			return {
				modelShow:false,
				modelContent:'',
				sexData: [{ dictKey: '1', dictValue: '男' },
						  { dictKey: '2', dictValue: '女' }],
				identifyCategoryData:[{ dictKey: '1', dictValue: '初次鉴定' }],
				personTypes:[
					{
						name:'职工本人',
						value:'myself'
					},
					{
						name:'用人单位',
						value:'employer'
					},
					{
						name:'近亲属',
						value:'relatives'
					}
				],
				formData:{
					identifyCategory:'1',
					aac004:'',
					aac002:'',
					aac003:'',
					accidentDate:''
				},
			}
		},
		watch:{
			formData:{
				handler(newval,oldVal){
					this.queryDecNum(newval);
				},
				deep:true //true 深度监听
			}
		},
		methods: {
			onAccidentDateChange(e){
				this.formData.accidentDate = e.value;
			},
			checkboxChange: function(e) {
			    var personTypes = this.personTypes;
				var values = e.detail.value;
				console.log('store.state.hh_user');
				console.log(store.state.hh_user);
				for (var i = 0, lenI = personTypes.length; i < lenI; ++i) {
					const personType = personTypes[i]
					if(values[values.length-1]==personType.value){
						this.$set(personType,'checked',true)
						if(personType.value=='myself'){
							this.formData.aac002=store.state.hh_user.idcard;
							this.formData.aac003=store.state.hh_user.fullName;
							this.formData.aac004=store.state.hh_user.sex;
							// this.formData.aac067=store.state.hh_user.cellphone;
							console.log(this.formData.aac004);
						}else{
							this.formData.aac002='';
							this.formData.aac003='';
							this.formData.aac004='';
							this.formData.aac067='';
						}
					}else{
						this.$set(personType,'checked',false)
					}
				}
			},
			onSexChange(e){
				this.formData.aac004 = e.value;
				console.log(this.formData.aac004);
			},
			queryDecNum(formData){
				if(formData.aac003&&formData.aac002&&formData.aac004&&formData.accidentDate){
					this.modelContent='未取到有效的认定工伤决定书，不能做劳动能力鉴定'
					this.modelShow = true
					return;
				}
			},
			submit(){
				this.modelContent='未取到有效的认定工伤决定书，不能做劳动能力鉴定'
				this.modelShow = true
			},
		}
	}
</script>

<style>
.personType{
	line-height: 100rpx;
}
.personTypeCheckbox{
	margin-left: 40rpx;
	padding-left: 0rpx;
}
.personTypeLabel{
	margin-left: 30rpx;
}
</style>
